<template>
  <view class="tab-content">
    <view v-if="noData" class="no-data">暂无查到数据</view>
    <view v-else class="vehicle-info">
      <view class="info-row" v-for="(value, key) in ownerData" :key="key">
        <text class="vehiclelabel">{{ getLabel(key) }}</text>
        <text class="vehiclevalue">{{ value || "暂无数据" }}</text>
      </view>
    </view>
  </view>
</template>

<script>
import { getVehicleQuery } from "@/common/api/hub_ygzw/vehicle/vehicle.js";

export default {
  props: ["vehicleData"],
  data() {
    return {
      ownerData: {},
      noData: false,
    };
  },
  created() {
    this.getOwnerInfo();
  },
  methods: {
    getOwnerInfo() {
      const params = {
        funcType: "QA0201",
        ownerId: this.vehicleData.ownerId || "",
        provinceCode: "",
        ownerName: "",
      };
      getVehicleQuery(params)
        .then((res) => {
          if (res.statusCode === 200) {
            if (
              res.data.pageInfo.totalpages == 0 ||
              !res.data.data ||
              Object.keys(res.data.data).length === 0
            ) {
              this.noData = true;
            } else {
              this.ownerData = res.data.data.ownerData;
              this.noData = false;
            }
          }
        })
        .catch((error) => {
          console.error("获取业户信息失败:", error);
          this.noData = true;
        });
    },
    getLabel(key) {
      const labels = {
        ownerName: "业户名称",
        ownerNature: "业户性质",
        businessScope: "经营范围",
        // 添加更多标签...
      };
      return labels[key] || key;
    },
  },
};
</script>

<style scoped lang="scss">
.tab-content {
  .no-data {
    text-align: center;
    color: #79829c;
    padding: 20px;
    font-size: 16px;
  }
  .info-row {
    display: flex;
    justify-content: space-between;
    margin-bottom: 20px;
    .vehiclelabel {
      color: #79829c;
    }
    .vehiclevalue {
      color: #0d1444;
    }
  }
}
</style>
